<template>
    <div class="down-pkb">
        <el-table
          :data="tableData"
          border
          >
          <el-table-column
            prop="name"
            label="名称"
            >
          </el-table-column>
          <el-table-column
            prop="date"
            width="150"
            label="日期"
            >
          </el-table-column>

          <el-table-column
            fixed="right"
            label="操作"
            width="300"
            >
            <template slot-scope="scope">
              <el-button @click="handleClick(scope.row)" type="text" size="small">下载</el-button>
              <el-button type="text" size="small" @click="checkMD5(scope.row)">MD5验证</el-button>
            </template>
          </el-table-column>

        </el-table>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                  tableData: [
                    {
                      date: '2019-11-11',
                      name: 'snapshot-00c1bd5fd72f185c740800bc47fbffdbe1dde3fdb5b17402d0a45a1a6e140d95.bin',
                      md5: '709EAB6DA9844A7CF8BB87253F811165'
                    }
                  ]
                }
        },
        methods: {
        handleClick(row) {
          window.open('http://ylb.abohui.com/staticResource/snapshot-00c1bd5fd72f185c740800bc47fbffdbe1dde3fdb5b17402d0a45a1a6e140d95.bin')
        },
        
        checkMD5(row) {
          this.$confirm('<p>复制MD5进行查验：</p><textarea  id="get_link">'+ row.md5 + '</textarea >', '提示', {
                        dangerouslyUseHTMLString: true,
                        confirmButtonText: '复制链接',
                        cancelButtonText: '取消'
                }).then(  () => {
                  const Url2 = document.getElementById("get_link");
                  Url2.select(); // 选择对象
                  document.execCommand("Copy"); // 执行浏览器复制命令
                  this.$message.success('复制成功')
                  setTimeout(() => {
                       window.open('http://www.atool9.com/file_hash.php')
                  }, 1500);
                })
        },
        mounted() {
          console.log(this.tableData)
        },
    },
    beforeRouteEnter(to, from, next) {
      next((vm) => { // 参数vm就是当前组件的实例。
        vm.$store.dispatch("isShowNav", true);
      })
    },
    }
</script>

<style lang="less" scoped>
  .down-pkb {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 1200px;
    padding-top: 150px;
  }
</style>